<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <!-- 引入样式 -->
  <link rel="stylesheet" href="../../plugins/element-ui/index.css" />
  <link rel="stylesheet" href="../../styles/common.css" />
  <link rel="stylesheet" href="../../styles/page.css" />
</head>
<body>
  <div class="dashboard-container" id="category-app">
    <div>
    <el-form
            ref="ruleForm"
            :model="ruleForm"
            :inline="false"
            label-width="180px"
            class="demo-ruleForm"
    >
      <el-form-item
              label="授权权限:"
              prop="authorId"
      >
        <el-select
                v-model="ruleForm.authorId"
                placeholder="请选择权限"
        >
          <el-option v-for="(item,index) in authorList" :key="index" :label="item.name" :value="item.id" />
        </el-select>
      </el-form-item>
      <el-button  type="primary"  @click="submitForm('ruleForm', false)">
        保存
      </el-button>
    </el-form>
    </div>

  </div>

    <!-- 开发环境版本，包含了有帮助的命令行警告 -->
    <script src="../../plugins/vue/vue.js"></script>
    <!-- 引入组件库 -->
    <script src="../../plugins/element-ui/index.js"></script>
    <!-- 引入axios -->
    <script src="../../plugins/axios/axios.min.js"></script>
    <script src="../../js/request.js"></script>
    <script src="../../js/index.js"></script>
    <script src="../../api/role.js"></script>
    <script src="../../api/member.js"></script>
    <script>
      new Vue({
        el: '#category-app',
        data() {
          return {
            id: '',
            ruleForm : {
              id: '',
              'authorId': ''
            },
            authorList: [],
            data: [{
              id: 1,

            }]
          };
        },
        created(){
          this.id = requestUrlParam('id')
          this.getAuthorList()
          this.init()
        },
        mounted(){

        },
        methods: {
          async init() {
            queryEmployeeById(this.id).then(res => {
              if (String(res.code) === '1') {
                this.ruleForm = res.data
                this.ruleForm.authorId = res.data.authorId
              } else {
                this.$message.error(res.msg || '操作失败')
              }
            })
          },
          // 获取
          getAuthorList () {
            getAuthorIdsList().then(res => {
              if (res.code === 1) {
                this.authorList = res.data
              } else {
                this.$message.error(res.msg || '操作失败')
              }
            })
          },
          submitForm (formName, st) {
            const params = {
              ...this.ruleForm,
            }
            updateAuthor(params).then(res => {
              if (res.code === 1) {
                this.$message.success('更新授权成功！')
                if (!st) {
                  this.goBack()
                }
              } else {
                this.$message.error(res.msg || '操作失败')
              }
            }).catch(err => {
              this.$message.error('请求出错了：' + err)
            })
          },
          goBack() {
            window.parent.menuHandle(
              {
                id: '303',
                url: '/backend/page/member/list.html',
                name: '部门管理',
              },
              false
            )
          }
        },
      })
    </script>

</body>
</html>